/* HeartAnimation.css */
.heart-container {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color:#0d0d18;
  overflow: hidden;
  position: relative;
}

.heart-canvas {
  max-width: 100%;
  max-height: 80vh; /* 在移动端留出更多空间 */
  object-fit: contain;
  background-color:#0d0d18;
}

/* 移动端特定样式 */
@media screen and (max-width: 768px) {
  .heart-container {
    height: 90vh; /* 在移动端减少高度以避免溢出 */
      background-color:#0d0d18;
  }
  
  .heart-canvas {
    max-height: 75vh;
      background-color:#0d0d18;
  }
}

@media screen and (max-width: 480px) {
  .heart-container {
    height: 85vh;
          background-color:#0d0d18;
  }
  
  .heart-canvas {
    max-height: 70vh;
          background-color:#0d0d18;
  }
}